<template>
	<view class="index">
		<view class="list" v-if="goods.length > 0">
			<view class="item" v-for="(item, index) in goods" :key="index" @tap="toDetail(item)">
				<view class="image">
					<image :src="item.img" mode=""></image>
				</view>
				
				<view class="info">
					<view class="title">{{item.name}}</view>
					<view class="time text-gray">{{item.time}}</view>
				</view>
			</view>
		</view>
		
		<view class="no-data" v-else>你还没有收藏的商品</view>
	</view>
</template>

<script>
	import Request from '../../common/request.js';
	
	export default {
		data() {
			return {
				goods: [],
				page: 1,
				nextPage: true
			};
		},
		onLoad() {
			this.getGoods();
		},
		onReachBottom() {
			this.getGoods();
		},
		methods: {
			//获取数据
			getGoods() {
				if(this.nextPage == false) {
					return false;
				}
				
				var that = this;
				Request.send({
					url: 'favorite/index',
					data: {
						type: 1,
						page: that.page
					},
					sCallback: function(res) {
						that.goods = that.goods.concat(res.data);
						that.page ++ ;
						if(res.data.length < 20) {
							that.nextPage = false;
						}
					}
				})
			},
			//去商品详情
			toDetail(item) {
				uni.navigateTo({
					url: '/pages/goods/detail?id='+item.id
				})
			}
		}
	}
</script>

<style>
	.list{
		background: #fff;
		margin-top: 20upx;
		font-size: 28upx;
	}
	
	.list .item{
		display: flex;
		flex-direction: row;
		padding: 20upx;
		border-bottom: 1upx solid #eee;
		align-items: center;
	}
	
	.list .item image{
		width: 120upx;
		height: 120upx;
	}
	
	.list .item .info{
		flex: 1;
		padding-left: 20upx;
	}
	
	.list .item .info .time{
		text-align: right;
		font-size: 20upx;
		margin-top: 20upx;
	}
</style>
